<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>金额相关</title>
    <link rel="stylesheet" th:href="@{../assets/libs/layui/css/layui.css}"/>
    <link rel="stylesheet" href="../assets/module/admin.css?v=311"/>
    <link rel="stylesheet" href="../assets/module/formSelects/formSelects-v4.css"/>
    <link rel="stylesheet" href="../assets/module/city-picker/city-picker.css"/>
    <script src="../assets/module/city-picker/city-picker.data.js"></script>
    <style>
        .btn-item {
            text-align: center;
            margin-top: 30px;
        }

        .btn-item .layui-btn {
            margin-right: 60px;
        }

        .btn-item .layui-btn:last-child {
            margin-right: 0px;
        }

        @media screen and (max-width: 450px) {

            .btn-item .layui-btn {
                margin-right: -5px;
            }
        }
    </style>
</head>
<body>
<!-- 加载动画，移除位置在common.js中 -->
<div class="page-loading">
    <div class="ball-loader">
        <span></span><span></span><span></span><span></span>
    </div>
</div>

<div class="layui-fluid" style="padding-bottom: 180px;">
            <div class="layui-card">
                <div class="layui-card-body layui-form layui-form-pane" lay-filter="test1">
                    <div class="layui-inline">
                        <select id="sys_cs_project">
                            <option value="0">所属项目</option>

                        </select>
                    </div>
                    <div class="layui-inline">
                        <button id="btnSearch" class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button>
                    </div>
                </div>
       </div>
    <table style="display: none" class="layui-table" id="regionTable" lay-filter="regionTable"></table>
</div>

<!-- js部分 -->
<script type="text/javascript" src="../assets/libs/layui/layui.js"></script>
<script type="text/javascript" src="../assets/js/common.js?v=311"></script>
<script>
    layui.use(['layer', 'form', 'admin', 'citypicker', 'formSelects', 'table', 'admin'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var admin = layui.admin;
        var cityPicker = layui.citypicker;
        var formSelects = layui.formSelects;
        var table = layui.table;
        var str=localStorage.getItem("projects");
        var arr1=str.split(",");
        for (var i=1;i<arr1.length;i++){
            $("#sys_cs_project").append(' <option value="'+i+'">'+arr1[i]+'</option>')
        }
        form.render('select', 'test1');
        function getProjectName(index) {
            var arr=str.split(",");
            return arr[index];
        }
        $("#btnSearch").click(function () {
            var region="%"+str+"%";
            getList();
        })
        //SELECT * FROM `sys_franchisee` WHERE sys_cs_region LIKE "%信州区%";
       function getList() {
           var arr=[
               {type: 'checkbox'},
               {field: 'sys_cs_company',align: 'center', title: '公司名称',totalRowText: '合计'},
               {field: 'sys_cs_name',align: 'center', title: '联系人'},
               {field: 'sys_cs_phone', align: 'center',title: '联系电话'},
               {align: 'center', title: '代理项目',
                   templet:function (item) {
                           return '<button class="layui-btn layui-btn-xs layui-btn-primary">'+getProjectName(item.sys_cs_project)+'</button>'
                   }
               },
               {field: 'sys_cs_money',align: 'center', totalRow: true,title: '已收账款'},
               {field: 'sys_cs_num',align: 'center', totalRow: true,title: '应收账款'},
               {field: 'sys_cs_region',align: 'center', title: '所属区域'}
           ];
           // 渲染表格
           table.render({
               elem: '#regionTable',
               url: '/sys/franchisee/getByRegion',
               where: {region: "%%",sys_cs_project:$("#sys_cs_project").val()},
               cellMinWidth: 100,
               page:true
               , totalRow: true,
               text: {
                   none: '暂无相关数据'
               },
                   cols: [arr]
               ,response: {
                   statusCode: 0 //重新规定成功的状态码为 200，table 组件默认为 0
               }
               ,parseData: function(res){ //将原始数据解析成 table 组件所规定的数据
                   if (res.total>0){
                       return {
                           "code": 0, //解析接口状态
                           "msg": res.message, //解析提示文本
                           "count": res.total, //解析数据长度
                           "data": res.list //解析数据列表
                       };
                   }
               }
           });
       }
    });
</script>
</body>
</html>